<template>
  <el-container>
    <el-header>
		<h3>体育馆管理系统</h3>
	</el-header>
    <el-container>
		<el-container class="home_content">
			<el-aside width="160px">
				<el-menu
					  class="home_content left_btn"
					  router
					  :unique-opened="true"
				      background-color="#545c64"
				      text-color="#fff"
				      active-text-color="#ffd04b">
				      <el-submenu>
				        <template slot="title">
				          <i class="el-icon-location"></i>
				          <span>场地管理</span>
				        </template>
				        <el-menu-item-group>
						  <el-menu-item index="/home/ground">场地管理</el-menu-item>
				          <el-menu-item index="/home/groundorder">场地预约管理</el-menu-item>
				          <el-menu-item index="/home/groundcollection">场地收藏管理</el-menu-item>
						  <el-menu-item index="/home/groundpreserve">场地维护管理</el-menu-item>
				        </el-menu-item-group>
				      </el-submenu>
				      <el-submenu>
				        <template slot="title">
				          <i class="el-icon-location"></i>
				          <span>赛事管理</span>
				        </template>
				        <el-menu-item-group>
				          <el-menu-item index="/home/saishi">赛事管理</el-menu-item>
				          <el-menu-item index="/home/saishicollection">赛事收藏管理</el-menu-item>
				          <el-menu-item index="/home/saishiorder">赛事订单管理</el-menu-item>
				        </el-menu-item-group>
				      </el-submenu>
				      <el-submenu>
				        <template slot="title">
				          <i class="el-icon-location"></i>
				          <span>商品管理</span>
				        </template>
				        <el-menu-item-group>
				          <el-menu-item index="/home/product">商品管理</el-menu-item>
				          <el-menu-item index="/home/productcollection">商品收藏管理</el-menu-item>
				          <el-menu-item index="/home/productorder">商品订单管理</el-menu-item>
				        </el-menu-item-group>
				      </el-submenu>
				      <el-menu-item index="/home/user">
				        <i class="el-icon-setting"></i>
				        <span slot="title">用户管理</span>
				      </el-menu-item>
					  <el-menu-item index="/home/carousel">
					    <i class="el-icon-setting"></i>
					    <span slot="title">轮播图管理</span>
					  </el-menu-item>
				    </el-menu>
			</el-aside>
			<el-main>
				<router-view></router-view>
			</el-main>
		</el-container>
      
    </el-container>
  </el-container>
</template>

<script>

export default {
  name: 'HomeView'
}
</script>

<style>
  .el-header {
    background-color: #B3C0D1;
    color: #333;
    text-align: left;
    line-height: 30px;
  }
  .left_btn{
	  /* overflow-y: hidden; */
	  overflow-x: hidden;
  }
  
  
  .el-aside {
    background-color: #D3DCE6;
    color: #333;
    line-height: 200px;
	
  }
  
  .el-main {
    background-color: #E9EEF3;
    color: #333;
    text-align: left;
    line-height: 50px;
  }
  
  body > .el-container {
    margin-bottom: 40px;
  }
  
  .home_content{
	  height: 100vh;
	  padding: 0;
  }
</style>
